<div class="box box-primary">
    <!--功能栏Begin-->
    <div class="box-header">
        <h3 class="box-title">划款指令列表</h3>
        <!-- <button type="button" class="btn btn-primary">导出当前页</button> -->
        <button type="button" class="btn btn-primary" [disabled]="nowStatus == 2 || nowStatus == 4 || nowStatus == 6 || nowStatus == 8 || nowStatus == 9 || nowStatus == 10" (click)="commonRequest('qrhkinstruction','post',$event,'qrhkzl')">确认划款指令</button>
        <button type="button" class="btn btn-primary" [disabled]="nowStatus == 1 || nowStatus == 4 || nowStatus == 6 || nowStatus == 8 || nowStatus == 9 || nowStatus == 10" (click)="commonRequest('recheckhkinstruction','post',$event,'fhhkzl')">复核划款指令</button>
        <button type="button" class="btn btn-primary" [disabled]="nowStatus == 1 || nowStatus == 2 || nowStatus == 3 || nowStatus == 6 || nowStatus == 8 || nowStatus == 9 || nowStatus == 10" (click)="commonRequest('checkhkinstruction','post',$event,'shhkzl')">审核划款指令</button>
        <button type="button" class="btn btn-primary" [disabled]="nowStatus == 1 || nowStatus == 2 || nowStatus == 3 || nowStatus == 4 || nowStatus == 8 || nowStatus == 9 || nowStatus == 10" (click)="commonRequest('sendoutbankhkinstruction','post',$event,'fshkzl')">发送划款指令</button>
        <button type="button" class="btn btn-primary"  (click)="commonRequest('turnhkinstruction','post',$event,'zlbh')">指令驳回</button>
        <button type="button" class="btn btn-primary" [disabled]="nowStatus == 8 || nowStatus == 9 || nowStatus == 10" (click)="commonRequest('repealhkinstruction','post',$event,'zlcx')">指令撤销</button>
        <button type="button" class="btn btn-primary" [disabled]="nowStatus == 1 || nowStatus == 2 || nowStatus == 3 || nowStatus == 4 || nowStatus == 6 || nowStatus == 9 || nowStatus == 10" (click)="commonRequest('confirmhkinstruction','post',$event,'sgdzqr')">手工到账确认</button>
    </div>
    <!--功能栏End-->
    <!--划款详细内容页面Begin-->
    <transfer-detail-modal [acceptData]="acceptData" (returnData)="acceptModalData($event)"></transfer-detail-modal>
    <!--划款详细内容End-->
    <div class="box box-body no-padding no-margin no-border-top">
        <!--查询条件Begin-->
        <form class="form-inline">
            <div class="form-group">
                <label for="stockCode">证券代码：</label>
                <input type="text" class="form-control tfi-search-input" id="stockCode">
            </div>
            <div class="form-group">
                <label for="stockName">证券名称：</label>
                <input type="text" class="form-control tfi-search-input" id="stockName">
            </div>
            <div class="form-group">
                <label for="fundCode">组合代码：</label>
                <input type="text" class="form-control tfi-search-input" id="fundCode">
            </div>
            <div class="form-group">
                <label for="instructionSendoutescrowDate">划款日期：</label>
                <input type="text" class="form-control tfi-search-input daterangepicker-plugin" id="instructionSendoutescrowDate">
            </div> 
            <div class="form-group">
                <label for="Date">指令创建日期：</label>
                <input type="text" class="form-control tfi-search-input daterangepicker-plugin" id="Date">
            </div>
            <!-- <div class="form-group">
                <label for="hkInstructionId">指令编号：</label>
                <input type="text" class="form-control tfi-search-input" id="hkInstructionId" name="hkInstructionId">
            </div> -->
            <div class="form-group">
                <label for="fundName">组合名称：</label>
                <input type="text" class="form-control tfi-search-input" id="fundName">
            </div>       
            <!-- <div class="form-group">
                <label for="hkInstructionStatus">指令状态：</label>
                <select class="form-control tfi-search-input" id="hkInstructionStatus" name="hkInstructionStatus">
                    <option value=""></option>
                    <option value="1">待确认</option>
                    <option value="2">待复核</option>
                    <option value="3">初审驳回</option>
                    <option value="4">待审核</option>
                    <option value="5">复核驳回</option>
                    <option value="6">待发送</option>
                    <option value="7">发送托管行出款</option>
                    <option value="8">手工到账确认</option>
                    <option value="9">已到账</option>
                    <option value="10">已撤销</option>
                </select>
            </div> -->
            <div class="form-group">
                <label for="hkTypeId">指令类型：</label>
                <select class="form-control tfi-search-input" id="hkTypeId" name="hkTypeId" style="width:68%">
                    <option></option>
                    <option value="XGSG_SQ_IPO_SH">新股申购-上海</option>
                    <option value="XGSG_SQ_IPO_SZ">新股申购-深圳</option>
                    <option value="ZJHH_DVP_SQS_TC">调出DVP账户（上清所）</option>
                    <option value="ZJHH_DVP_SQS_TR">调入DVP账户（上清所）</option>
                    <option value="ZJHH_DVP_ZZ_TC">调出DVP账户（中债） </option>
                    <option value="ZJHH_DVP_ZZ_TR">调入DVP账户（中债）</option>
                </select>
            </div>
            <div class="form-group search-btn-container max">
                <button type="button" class="btn btn-primary" (click)="search()">查询</button>
                <button type="button" class="btn btn-warning" (click)="resetSearch()">重置</button>
            </div>
        </form>
        <!--查询条件end-->
        <!--tab切换Begin-->
        <div class="fuelux">
            <div class="wizard" id="purchase-wizard">
                <div class="steps-container padding-right-10">
                    <ul class="steps">
                        <li data-step="1" [class.active]="nowStatus == ''" (click)="switchStatus('')">
                            <span class="badge"></span>全部
                            <span class="chevron"></span>
                        </li>
                        <li data-step="2" [class.active]="nowStatus == 1" (click)="switchStatus(1)">
                            <span class="badge"></span>待确认
                            <span class="chevron"></span>
                        </li>
                        <li data-step="3" [class.active]="nowStatus == 2" (click)="switchStatus(2)">
                            <span class="badge"></span>待复核
                            <span class="chevron"></span>
                        </li>
                        <li data-step="4" [class.active]="nowStatus == 4" (click)="switchStatus(4)">
                            <span class="badge"></span>待审核
                            <span class="chevron"></span>
                        </li>
                        <li data-step="5" [class.active]="nowStatus == 6" (click)="switchStatus(6)">
                            <span class="badge"></span>待发送
                            <span class="chevron"></span>
                        </li>
                        <li data-step="6" [class.active]="nowStatus == 8" (click)="switchStatus(8)">
                            <span class="badge"></span>已发送
                            <span class="chevron"></span>
                        </li>
                        <li data-step="7" [class.active]="nowStatus == 9" (click)="switchStatus(9)">
                            <span class="badge"></span>已到账
                            <span class="chevron"></span>
                        </li>
                        <li data-step="8" [class.active]="nowStatus == 10" (click)="switchStatus(10)">
                            <span class="badge"></span>已撤销
                            <span class="chevron"></span>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <!--切换end-->
        <!--划款指令列表Begin-->
        <transfer-list [data]="data" [status]="status" [hkType]="hkType" [bizType]="bizType" (sendData)="acceptListData($event)"></transfer-list>
        <!--划款指令列表End-->
        <!--划款指令列表分页Begin-->
        <div class="box-footer clearfix">
            <app-pagination
                [currentPageNum]="pageInfo.currentPageNum"
                [pagesShow]="pageInfo.pagesShow"
                [totalPages]="pageInfo.totalPages"
                (pageChanged)="pageNavigation($event)">
                <div class="pull-left pagination-detail" data-pagination-additional="true">
                    <span class="pagination-info">
                        当前显示第{{pageInfo.startRow}}到第{{pageInfo.endRow}}条&nbsp;&nbsp;&nbsp;&nbsp;总共{{pageInfo.total}}条
                    </span>
                    <span class="page-list">
                        <span class="btn-group dropup">
                            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                                <span class="page-size">{{pageInfo.pageSize}}</span>
                                <span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu" role="menu">
                                <li *ngFor="let i of pageInfo.pageList" role="menuitem"
                                    [class.active]="pageInfo.pageSize === i"
                                    (click)="pageSizeChange(i)">
                                <a href="javascript:void(0)">{{i}}</a>
                                </li>
                            </ul>
                        </span> 
                        条记录每一页
                    </span>
                </div>
            </app-pagination>
        </div>
        <!--划款指令列表分页End-->
    </div>
</div>
